<template>
	<view style="width: 100%;">
		<view>
			<block v-for="(round, roundIdx) in rindex" :key="roundIdx">
				<view class="popup_group">
					<view class="lay-c-c" style="padding: 10px;">
						<text class="title">第{{roundIdx+1}}场 已抽取用户</text>
					</view>
					<view class="tab">
						<!-- <view class="mg-b-md pd-md" v-for="(player, index) in rounds[roundIdx+1]" :key="index">
						  <view>
							<label> {{player.nickname+"("+player.phone+")"+player.race_partition+"区-"+player.pond_code+"-"+player.seat_no}} </label>
						  </view>
						</view> -->
						<view class="tabRow" v-for="(player, index) in rounds[roundIdx+1]" :key="index">
						 <!-- <view>
							<label> {{player.nickname+"("+player.phone+")"+player.race_partition+"区-"+player.pond_code+"-"+player.seat_no}} </label>
						  </view> -->
						  <view v-for="(col, colidx) in player" :key="colidx" class="tabCol">
						  	{{columns[colidx].name}}:{{col}}
						  </view>
						  <view style="clear: both;"></view>
						</view>
						
						<!-- <scroll-view scroll-x scroll-y scroll-with-animation style="width: 100%; background-color: red;">
							<view v-for="(row, rowidx) in rounds[roundIdx+1]" style="display: flex;flex-direction: column; width: 100%;">
								<view :style="'overflow: hidden; height: 50rpx; width:50rpx'" v-for="(r, id) in row">{{r}}</view>
							</view>
						</scroll-view> -->
					</view>
				</view>
			</block>
		</view>
	</view>
</template>

<script>
const app = getApp();
import { navigateTo, serialize, setStorage, getStorage, removeStorage, Loading, hideLoading, Modal } from '../../libs/uniApi.js';
import store from '@/store';
import {genDefaultPartition, correctSeats, MyTip} from '../../components/ssty/common.js';

import {queryForEditRound, saveForEditRound, openRoundLottery, resetRoundLottery, showDrawLottery} from '@/api/fsh.js'

export default {
	data() {
		
		return {
			rounds : {},
			rindex : [],
			columns: {},
			
			headerStyle: {
				'height': '80rpx', // $round-tab-h
				'background-color': '#FFF',
				'border-bottom': '1px solid #f8f8f8',
				'font-weight': 'bold'
			},
			bodyStyle: {
				'background-color': '#FFF',
			},
			rowStyle: {
				'height': '72rpx'
			},
		};
	},
	onLoad(opt) {
		this.merId = opt.merId;
		this.product_id = opt.prodId;
		this.raceId = opt.raceId;
		
		this.rounds = {};
		this.rindex = [];
		
		// 查询钓塘列表
		showDrawLottery(this.raceId).then(res=>{
			console.log("showDrawLottery|",res)
			let width = "100rpx";
			this.columns = [
				{name: "昵称", width: width}, 
				{name: "钓位", width: width}
			];
			for(let i in res.entity){
				if(res.entity[i].round){
					let player = [];
					if(!this.rounds[res.entity[i].round]){
						this.rounds[res.entity[i].round]=[];
						this.rindex.push(1);
					}
					player.push(res.entity[i].nickname)
					if(res.entity[i].draw_lots_state>0 && res.entity[i].race_round_status>=2){
						let tmp = res.entity[i].race_partition+"区-"+res.entity[i].seat_no+"号位";
						if(res.entity[i].draw_lots_state==2){
							tmp += "【系统代抽】";
						}
						player.push(tmp)
					}else{
						let tmp = "【未抽签】"
						if(res.entity[i].draw_lots_state == 1){
							tmp = res.entity[i].race_partition+"区-"+res.entity[i].seat_no+"号位"
						}
						player.push(tmp)
					}
					// if(res.entity[i].draw_lots_state==0 && res.entity[i].race_round_status<2){
					// 	player.push("【未抽】")
					// }else if(res.entity[i].draw_lots_state==1){
					// 	player.push(res.entity[i].race_partition+"区-"+"-"+res.entity[i].seat_no+"号位")
					// }else if(res.entity[i].draw_lots_state==2){
					// 	player.push(res.entity[i].race_partition+"区-"+res.entity[i].seat_no+"号位"+"【系统代抽】")
					// }
					this.rounds[res.entity[i].round].push(player)
				}
			}
			console.log(this.rounds)
			if(this.rindex.length==0){
				Modal('无人抽签', '', {showCancel: false})
				.then(() => {
					uni.navigateBack();
				})
			}
		}).catch(e=>{
			console.error(e);
			Modal('查询失败，请稍后重试', '', {showCancel: false})
			.then(() => {
				uni.navigateBack();
			})
		});
	},
	methods: {
		genDefaultPartiLots() {
			let partis = [];
			for(let i = 0; i < this.partitionNumber; i++)
				partis.push({partitionNum: (i+1), checked: 1});
				
			return {
				last_partitions: partis, 		
				new_partitions: partis
			};
		},
		
		delLotItem(roundIdx, lotItemIdx) {
			this.seatLotteryRules[roundIdx].splice(lotItemIdx, 1);
			console.log("delLotItem " + lotItemIdx + " from round " + roundIdx, this.seatLotteryRules);
			
			this.seatLotteryRules = JSON.parse(JSON.stringify(this.seatLotteryRules)); // 赋值让UI刷新
		},
		
		addLotItem(roundIdx) {
			this.seatLotteryRules[roundIdx].push(this.genDefaultPartiLots());
			console.log("addLotItem to round "+roundIdx, this.seatLotteryRules);
			
			this.seatLotteryRules = JSON.parse(JSON.stringify(this.seatLotteryRules)); // 赋值让UI刷新
		},
		
		lotItemLastPartitionChange(e, roundIdx, lotItemIdx) {
			// debugger
			//console.log("lotItemPartitionChange", JSON.stringify(e), roundIdx, lotItemIdx)
			//let ary = e.detail.value.map(a=>{partitionNum: parseInt(a), checked: 1})
			
			let parts = [];
			for(let i = 0; i < this.partitionNumber; i++) {
				let checked = undefined !== e.detail.value.find(a=>parseInt(a)==i+1)
				parts.push({partitionNum: i+1, checked: checked});
			}
			
			this.seatLotteryRules[roundIdx][lotItemIdx].last_partitions = parts;
		},
		
		lotItemNewPartitionChange(e, roundIdx, lotItemIdx) {
			// debugger
			// console.log("lotItemNewPartitionChange", JSON.stringify(e), roundIdx, lotItemIdx)
			
			let parts = [];
			for(let i = 0; i < this.partitionNumber; i++) {
				let checked = undefined !== e.detail.value.find(a=>parseInt(a)==i+1)
				parts.push({partitionNum: i+1, checked: checked});
			}
			
			this.seatLotteryRules[roundIdx][lotItemIdx].new_partitions = parts;
		},
		
		resetRoundLottery(roundIdx) {
			
		},
		
		openRoundLottery(roundIdx) {
			let onOff = this.rounds[roundIdx].drawLotsStatus == 0 ? 1 : 0;
			openRoundLottery(this.raceId, roundIdx+1, onOff).then(res=>{
				this.rounds[roundIdx].drawLotsStatus = onOff;
			}).catch(err=>{
				
			})
		},
		
		doSubmit() {
			let postData = {
				raceId: this.raceId,
				step: 3,
				seatLotteryRules: JSON.stringify(this.seatLotteryRules),
			};
			
			uni.showLoading({
				title: '保存中...'
			});
			
			saveForEditRound(this.raceId, postData)
			.then(res => {
				hideLoading()
				Modal('保存成功', '', {
					showCancel: false
				}).then(() => {
					uni.navigateBack();
				})
			})
			.catch(errMsg => {
				uni.hideLoading();
				console.log("race_manage_edit_draw_lots, saveForEditRound fail", errMsg);
				MyTip(errMsg);
			});
		},
	}
};
</script>

<style lang="scss" scoped>

@import "@/leui.scss";
.tab{
	width: 100%;
	overflow: scroll;
	border: 1px solid #ccc;
}
.tabRow{
	width: 100%;
	// padding: 50px;
}
.tabCol{
	width: 60%;
	float: left;
	border-bottom: 1px solid #ccc;
}
.tabCol:nth-child(odd){
	width: 40%;
	float: left;
	border-bottom: 1px solid #ccc;
}
.popup_group {
	background: #fff;
	margin: 31rpx auto;
	width: 710rpx;
	font-size: 30rpx;
	border-radius: 10rpx;
	.popup_group_item {
		padding: 32rpx 30rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		.popup_group_item_value {
			display: flex;
			align-items: center;
			.popup_group_item_message {
				margin-right: 15rpx;
				color: #bbbbbb;
				max-width: 400rpx;
				&_value {
					color: #000;
				}
			}
			.iconfont {
				color: #bbbbbb;
			}
			input {
				text-align: right;
			}
		}
	}
	// > view:not(:last-child) {
	// 	border-bottom: 1px solid #eeeeee;
	// }
}

</style>
